<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单练习</title>
</head>
<body>
<h3>表单练习</h3>
<!--
form：表单
action：表单提交的位置 可能是网站，也可能是一个请求处理地址
method：提交方式 post、get提交方式
        get方式提交:我们可以在url中看到我们提交的信息，不安全，高效。
        post比较安全，输大文件。
value=""：默认初始值
maxlength=""：最长可以写介个字符
size=""：文本框的长度

-->
<form action="7.媒体元素.html" method="get">
<!--  text文本输入框   readonly：只读    hidden：隐藏  disable：禁用-->
<!--  placeholder：提示信息  -->
<!--  required:非空判断  -->
<!--  pattern:正则表达式  -->
    <p>账号：<input type="text" name="username"  placeholder="请输入用户名" required ></p>
<!--  password密码框  -->
    <p>密码：<input type="password" name="pwd" id="forget" placeholder="请输入密码" required  >&nbsp;&nbsp;<label for="forget">忘记密码</label></p>
<!--
    radio:单选框标签
    name：表示组
  -->
    <p>性别：
<!--    checked默认选中    -->
        <input type= "radio" value="boy"  name="sex" checked>男
        <input type="radio" value="girl" name="sex">女
    </p>
<!--  复选框  -->
    <p>爱好：
        <input type="checkbox" value="read" name="hobby">读书
        <input type="checkbox" value="sleep"  name="hobby" checked>睡觉
        <input type="checkbox" value="code" name="hobby" checked>写代码
        <input type="checkbox" value="ride" name="hobby">骑车

    </p>
    <p>
<!--
按钮：
    type="button":普通按钮
    type="image":图像按钮
    type="submit":提交按钮
    type="reset":重置按钮
-->
        按钮：
        <input type="button" name="btn1" value="点击变长">
<!--        <input type="image" src="../resources/image/头像.png">-->

    </p>
<!--  下拉框  -->
    <p>省份:
        <select name="列表名称" >
            <option value="Beijing" >北京</option>
<!--      selected 默认选定      -->
            <option value="Shannxi" selected>陕西</option>
            <option value="Sichuan">四川</option>
            <option value="Chongqing">重庆</option>
<!--      disable：禁用      -->
            <option value="Taiwan" disabled>台湾</option>
        </select>
    </p>
<!--  文本域  -->
    <p>评论：</p>
    <p>
        <textarea name="textarea"  cols="90" rows="30" placeholder="输入评论" required>ohh</textarea>
    </p>
<!--  文件域  -->
    <p>选择文件：
        <input type="file" name="files">
        <input type="submit" value="提交" name="upload">
    </p>
    <!--  邮件验证  -->
    <p>邮箱：
        <input type="email" name="email" placeholder="请输入邮箱" required  >
    </p>
    <!--  URL验证  -->
    <p>URL：
        <input type="url" name="url" placeholder="请输入url" required  >
    </p>
    <!--  数字验证  -->
    <p>数字：
        <input type="number" min="0" max="100" step="10">
    </p>
    <!--  滑块  -->
    <p>温度
        <input type="range" name="temperature" min="-50" max="50" step="10">
    </p>
    <!--  搜索框  -->
    <p>导航栏：
        <input type="search" name="search">
    </p>
    <p>
<!--    submi提交表单    -->
        <input type="submit" value="登录">
<!--    reset重置    -->
        <input type="reset" value="重置">
    </p>
</form>
</body>
</html>